<!DOCTYPE HTML>
<html lang="zh-cn">
  <head>
    <meta charset="UTF-8">
    <title>Powerful JQuery Plugins</title>
    <link href="/js/jQueryUI/jquery-ui.css" type="text/css" rel="stylesheet"></link>
    <link href="/js/jQueryScrollbar/perfect-scrollbar.css" type="text/css" rel="stylesheet"></link>
  	<style type="text/css">
  		* {
  			margin: 0;
  			padding: 0;
  		}
  		/* 
  			内联元素的高度是由行高决定的
  			单行文字的高度表现为
  			内容区域高度 + 行间距 = 行高
  		*/
  		p {
  			border: 1px solid black;
  			margin: 50px;
  		}
  		p em {
  			line-height: 500px;
  		}
  		p.first {
  			line-height: 100px;
  			font-size: 10px;
  		}
  		p.last {
  			font-size: 100px;
  			line-height: 0;
  		}
  	</style>
  </head>
  
  <body>
  	<div>
  		<p class="first">line-height的数值是两行之间<em>基线</em>的距离</p>
  		<p class="last">line-height的数值是两行之间<em>基线</em>的距离</p>
  	</div>
    <script src="/js/jQuery/jquery-1.11.3.js" type="text/javascript"></script>
    <script src="/js/jQueryUI/jquery-ui.js" type="text/javascript"></script>
    <script src="/js/jQueryValidation/jquery.validate.js" type="text/javascript"></script>
    <script src="/js/jQueryValidation/messages_zh.js" type="text/javascript"></script>
    <script src="/js/jQueryValidation/additional-methods.js" type="text/javascript"></script>
    <script src="/js/jQueryValidation/additional-methods.js" type="text/javascript"></script>
    <script src="/js/jQueryScrollbar/perfect-scrollbar.jquery.js" type="text/javascript"></script>
  </body>
</html>